<template lang="pug">
    div(class="menu-index")
        skin(@up="up",@down="down",@yes="yes",@back="back",@duringUp="up",@duringDown="down")
            div(class="flex-column h3")
                div(class="flex-column-item flex-1" )
                    div(class="flex-row")
                        div(class="flex-row-item flex-center-center flex-7") -----主菜单----
                        div(class="flex-row-item right") {{activeId + 1}}
                div(class="flex-column-item flex-center flex-3")
                    div(class="flex-row")
                        div(class="flex-row-item flex-4",style="height:100%")
                            div(class="flex-column")
                                div(class="flex-column-item flex-center",v-for="(menu,index) in currentPageMenus",
                                :key="menu.id")
                                    span(class="iconfont",:style="{'visibility': index == currentMenuIndex ? 'visible' : 'hidden'}") &#xe62c;
                                    span {{menu.name}}
                        div(class="flex-row-item right",style="height:100%")
                            control-line(:total="menus.length",:current="activeId",style="float:right;")
</template>

<script>
    import MenuList from "@/mixins/MenuList";
    export default {
        mixins: [MenuList],
        data() {
            return {
                menus: [
                    {name: "大剂量", id: 0, to: "/large-dose/menu"},
                    {name: "基础率", id: 1, to: "/base-rate"},
                    {name: "装药-排气", id: 2, to: "/charge-exhuast"},
                    {name: "输注暂停", id: 3, to: "/menu/stop"},
                    {name: "参数设置", id: 4, to: "/machine-setting"},
                    {name: "医生设置参数", id: 5, to: "/advance-setting/password"}
                ],
                page: {maxResultCount: 3, skipCount: 0},
                visible: false
            };
        },

        methods: {
            up() {
                if (this.visible) return;

                this.activeId--
            },
            down() {
                if (this.visible) {
                    window.dose.infusionStopped = true;
                    window.dose.infusionStopAt = new Date();
                    this.$router.push("/");
                    return;
                }

                this.activeId++;
            },

            back() {
                if (this.visible) {
                    this.visible = false;
                    return;
                }
                this.$router.push("/index");
            },
            yes() {
                if (this.visible) {
                    this.visible = false;
                    return;
                }

                this.$router.push(this.currentMenu.to);
            }
        }
    };
</script>

<style lang="less">
</style>
